<template>
    <el-dialog
    title="新增"
    :visible="isShowAddDialog"
    width="70%"
    @close="dialogClose"
    :before-close="handleClose"
    :close-on-click-modal="false"
      >
    <el-form :model="ruleForm" :rules="rules" ref="addForm" label-width="120px">
        <el-tabs type="card" class="tab">
            <el-tab-pane label="第1页">
                <!-- <el-row :gutter="24">
                    <el-col :span="22">
                        <el-form-item label="委托合同编号" prop="wthtbh">
                            <el-select v-model="ruleForm.wthtbh" style="width: 100%;">
                                <el-option
                                    v-for="item in areas"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row> -->
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="拍卖会编号" prop="pmhbh">
                            <el-select v-model="ruleForm.pmhbh" style="width: 100%;">
                                <el-option
                                    v-for="item in pmhbhOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="2">
                        <el-button type="primary" @click="getPmhData">查询</el-button>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="拍卖会名称" prop="pmhmc">
                            <el-input v-model="ruleForm.pmhmc" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="拍卖形式" prop="pmxs">
                            <el-input v-model="ruleForm.pmxs" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <el-form-item label="发布状态" prop="fbzt">
                            <el-select v-model="ruleForm.fbzt" class="select">
                                <el-option value="已提交">已提交</el-option>
                                <el-option value="待提交">待提交</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col> -->
                    <el-col :span="12">
                        <el-form-item label="标的名称" prop="bdmc">
                            <el-input v-model="ruleForm.bdmc"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <!-- <el-col :span="10">
                        <el-form-item label="标的编号" prop="bdbh">
                            <el-input v-model="ruleForm.bdbh"></el-input>
                        </el-form-item>
                    </el-col> -->
                    
                </el-row>
            
                <el-row :gutter="24">
                    <!-- <el-col :span="10">
                        <el-form-item label="标的类型" prop="bdlx">
                            <el-input v-model="ruleForm.bdlx"></el-input>
                        </el-form-item>
                    </el-col> -->
                    <el-col :span="10">
                        <el-form-item label="委托方类型" prop="wtflx">
                            <el-select v-model="ruleForm.wtflx" class="select" :clearable="true1">
                                <el-option value="司法委托">司法委托</el-option>
                                <el-option value="政府委托">政府委托</el-option>
                                <el-option value="海关委托">海关委托</el-option>
                                <el-option value="金融资产机构委托">金融资产机构委托</el-option>
                                <el-option value="破产清算组委托">破产清算组委托</el-option>
                                <el-option value="其他机构委托">其他机构委托</el-option>
                                <el-option value="个人委托">个人委托</el-option>
                                <el-option value="生产企业委托">生产企业委托</el-option>
                                <el-option value="慈善委托">慈善委托</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" class="style3">
                        <el-form-item label="报名限制" prop="bmxz">
                            <el-radio label="不限" v-model="ruleForm.bmxz">不限</el-radio>
                            <el-radio label="个人报名" v-model="ruleForm.bmxz">个人报名</el-radio>
                            <el-radio label="机构报名" v-model="ruleForm.bmxz">机构报名</el-radio>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <!-- <el-col :span="10">
                        <el-form-item label="拍卖形式" prop="pmxs">
                            <el-input v-model="ruleForm.pmxs"></el-input>
                        </el-form-item>
                    </el-col> -->
                </el-row>
            
                <!-- <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="拍卖状态" prop="pmzt">
                            <el-select v-model="ruleForm.pmzt" class="select">
                                <el-option value="未开拍">未开拍</el-option>
                                <el-option value="拍卖中">拍卖中</el-option>
                                <el-option value="已成交">已成交</el-option>
                                <el-option value="已流拍">已流拍</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="悔拍状态" prop="hpzt">
                            <el-select v-model="ruleForm.hpzt" class="select">
                                <el-option value="已悔拍">已悔拍</el-option>
                                <el-option value="未悔拍">未悔拍</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="操作时间" prop="czsj">
                            <el-date-picker
                            v-model="ruleForm.czsj"
                            type="datetime"
                            placeholder="选择日期和时间"
                            style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm:ss"
                            :clearable="true1">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="缴纳方式" prop="jnfs">
                            <el-select v-model="ruleForm.jnfs" class="select">
                                <el-option value="刷卡">刷卡</el-option>
                                <el-option value="扫码">扫码</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="所在地" prop="szd">
                            <el-cascader
                            v-model="ruleForm.szd"
                            :options="options"
                            @change="handleChange"
                            style="width:100%">
                            </el-cascader>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="详细地址" prop="xxdz">
                            <el-input v-model="ruleForm.xxdz"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="咨询人" prop="zxr">
                            <el-input v-model="ruleForm.zxr"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="咨询人电话" prop="zxlxfs">
                            <el-input v-model="ruleForm.zxlxfs"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="所属分类" prop="ssfl">
                            <el-cascader
                            v-model="ruleForm.ssfl"
                            :options="this.ssfl"
                            @change="handleChange2"
                            style="width:100%"
                            :clearable="true1">
                            </el-cascader>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <el-form-item label="二级分类" prop="ejfl">
                            <el-select v-model="ruleForm.ejfl" class="select" clearable>
                                <el-option value="111111">111111</el-option>
                            </el-select>
                        </el-form-item>
                    </el-col> -->
                    <el-col :span="12">
                        <el-form-item label="拍卖方式" prop="pmfs">
                            <el-radio label="按总价拍" v-model="ruleForm.pmfs">按总价拍</el-radio>
                            <el-radio label="按单价拍" v-model="ruleForm.pmfs">按单价拍</el-radio>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <div class="sub-title">激活即列出输入建议</div>
                        <el-autocomplete
                        class="inline-input"
                        v-model="state1"
                        :fetch-suggestions="querySearch"
                        placeholder="请输入内容"
                        @select="handleSelect"
                        ></el-autocomplete>
                    </el-col> -->
                </el-row>
            
                <el-row :gutter="24">
                    <!-- <el-col :span="10">
                        <el-form-item label="VR链接地址" prop="vrljdz">
                            <el-input v-model="ruleForm.vrljdz"></el-input>
                        </el-form-item>
                    </el-col> -->
                    
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="起拍价(元)" prop="qpj">
                            <el-input v-model="ruleForm.qpj"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="保证金(元)" prop="bzj">
                            <el-input v-model="ruleForm.bzj"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="评估价(元)" prop="pgj">
                            <el-input v-model="ruleForm.pgj"></el-input>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <el-form-item label="有无保留价" prop="blj">
                            <el-radio label="1" v-model="ruleForm.blj">有</el-radio>
                            <el-radio label="2" v-model="ruleForm.blj">无</el-radio>
                        </el-form-item>
                    </el-col> -->
                    <el-col :span="12">
                        <el-form-item label="保留价(元)" prop="blj">
                            <el-input v-model="ruleForm.blj"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="加价幅度" prop="jjfd">
                            <el-input v-model="ruleForm.jjfd"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="12">
                        <el-form-item label="公开保留价" prop="sfblj">
                            <el-radio label="是" v-model="ruleForm.sfblj">是(明拍)</el-radio>
                            <el-radio label="否" v-model="ruleForm.sfblj">否(暗拍)</el-radio>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <el-form-item label="拍卖方式" prop="pmfs">
                            <el-input v-model="ruleForm.pmfs"></el-input>
                        </el-form-item>
                    </el-col> -->
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="18">
                        &nbsp;
                    </el-col>
                    <el-col :span="2">
                        <el-form-item>
                            <el-button type="primary" @click="submit">保存</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-tab-pane>
            

            <el-tab-pane label="第2页">
                <!-- <el-row :gutter="28">
                    <el-col :span="7">
                        <el-form-item prop="freeDay" label="自由竞价时间">
                            <el-select placeholder="0天" v-model="timeForm.freeDay">
                                <el-option
                                    v-for="item in days"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="freeHour">
                            <el-select placeholder="0时" v-model="timeForm.freeHour">
                                <el-option
                                    v-for="item in hours"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="freeMinute">
                            <el-select placeholder="0分" v-model="timeForm.freeMinute">
                                <el-option
                                    v-for="item in minutes"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="freeSecond">
                            <el-select placeholder="0秒" v-model="timeForm.freeSecond">
                                <el-option
                                    v-for="item in seconds"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row> -->
            
                <el-row :gutter="24">
                    <el-col :span="7">
                        <el-form-item prop="limitedHour" label="限时竞价时间">
                            <el-select placeholder="0时" v-model="timeForm.limitedHour">
                                <el-option
                                    v-for="item in hours"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="limitedMinute">
                            <el-select placeholder="0分" v-model="timeForm.limitedMinute">
                                <el-option
                                    v-for="item in minutes"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="limitedSecond">
                            <el-select placeholder="0秒" v-model="timeForm.limitedSecond">
                                <el-option
                                    v-for="item in seconds"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="7">
                        <el-form-item prop="delayedHour" label="延时竞价时间">
                            <el-select placeholder="0时" v-model="timeForm.delayedHour">
                                <el-option
                                    v-for="item in hours"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="delayedMinute">
                            <el-select placeholder="0分" v-model="timeForm.delayedMinute">
                                <el-option
                                    v-for="item in minutes"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7" class="style2">
                        <el-form-item prop="delayedSecond">
                            <el-select placeholder="0秒" v-model="timeForm.delayedSecond">
                                <el-option
                                    v-for="item in seconds"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="12">
                        <el-form-item label="是否限购" prop="sfxg">
                            <el-radio label="是" v-model="ruleForm.sfxg">是</el-radio>
                            <el-radio label="否" v-model="ruleForm.sfxg">否</el-radio>
                            <el-radio label="不确定" v-model="ruleForm.sfxg">不确定</el-radio>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" class="style3">
                        <el-form-item label="是否支持贷款" prop="sfdk">
                            <el-radio label="是" v-model="ruleForm.sfdk">是</el-radio>
                            <el-radio label="否" v-model="ruleForm.sfdk">否</el-radio>
                            <el-radio label="不确定" v-model="ruleForm.sfdk">不确定</el-radio>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="12">
                        <el-form-item label="是否收佣金" prop="sfsqyj">
                            <el-radio label="收取" v-model="ruleForm.sfsqyj">收取</el-radio>
                            <el-radio label="不收取" v-model="ruleForm.sfsqyj">不收取</el-radio>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="24">
                        <el-form-item label="收佣金方式" prop="sqyjfs">
                            <el-radio  label='固定比例' @change="radioType" v-model="ruleForm.sqyjfs">固定比例</el-radio>
                            <el-radio  label='区间比例' @change="radioType" v-model="ruleForm.sqyjfs">区间比例</el-radio>
                            <el-radio  label='固定金额' @change="radioType" v-model="ruleForm.sqyjfs">固定金额</el-radio>
                            <!-- <el-radio  label='4' @change="radioType(e)">其他</el-radio> -->
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24" v-if="this.ruleForm.sqyjfs == '固定比例'">
                    <el-col :span="10">
                        <el-form-item label="固定比例" prop="gdbl">
                            <el-input v-model="ruleForm.gdbl"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        %
                    </el-col>
                    <el-col :span="12" class="style4">
                        <el-form-item label="佣金上限" prop="yjsx">
                            <el-input v-model="ruleForm.yjsx"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        元
                    </el-col>
                </el-row>
            
                <el-row :gutter="24" v-if="this.ruleForm.sqyjfs == '区间比例'">
                    <el-col :span="5">
                        <el-form-item label="区间比例" prop="qjblxx">
                            <el-input v-model="ruleForm.qjblxx"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        %
                    </el-col>
                    <el-col :span="1" class="style5">
                        至
                    </el-col>
                    <el-col :span="5" class="style6">
                        <el-form-item prop="qjblsx">
                            <el-input v-model="ruleForm.qjblsx"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        %
                    </el-col>
                    <el-col :span="12" class="style4">
                        <el-form-item label="佣金上限" prop="yjsx">
                            <el-input v-model="ruleForm.yjsx"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        元
                    </el-col>
                </el-row>
            
                <el-row :gutter="24" v-if="this.ruleForm.sqyjfs == '固定金额'">
                    <el-col :span="10">
                        <el-form-item label="固定金额" prop="gdje">
                            <el-input v-model="ruleForm.gdje"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1" class="style4">
                        元
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="18">
                        &nbsp;
                    </el-col>
                    <el-col :span="2">
                        <el-form-item>
                            <el-button type="primary" @click="submit">保存</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-tab-pane>

            <el-tab-pane label="第3页">
                <el-row :gutter="24">
                    <el-col :span="22">
                        <el-form-item label="标的介绍" prop="bdjs">
                            <!-- <el-input type="textarea" v-model="ruleForm.bdis"></el-input> -->
                            <QuillEditor class="editor" v-model="ruleForm.bdjs" @changeClick="quillChange1"></QuillEditor>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="24">
                        <el-form-item label="上传图片" prop="sctp">
                            <el-upload class="avatar-uploader" :action='actionLogo' list-type="picture-card"
                                :show-file-list="false" :on-success="logohandleAvatarSuccess">
                                <img v-if="this.ruleForm.sctp" :src="this.ruleForm.sctp" class="avatar">
                                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="24">
                        <el-form-item label="上传视频" prop="scsp" v-model="ruleForm.scsp">
                            <el-upload
                            class="upload-demo"
                            :limit="1"
                            :action="actionVideo"
                            :on-success="handleVideo"
                            :on-remove="handleRemoveVideo">
                            <el-button size="small" type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">请按如下要求进行上传：格式限制：mp4，大小限制：&lt;=200MB。</div>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="24">
                        <el-form-item label="上传附件" prop="scfj" v-model="ruleForm.scfj">
                            <el-upload
                            class="upload-demo"
                            :limit="1"
                            :action="actionFile"
                            :on-success="handleFile"
                            :on-remove="handleRemoveFile">
                            <el-button size="small" type="primary">点击上传</el-button>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                </el-row>
            
                <el-row :gutter="24">
                    <el-col :span="22">
                        <el-form-item label="重要提示" prop="zyts">
                            <el-input type="textarea" v-model="ruleForm.zyts"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="18">
                        &nbsp;
                    </el-col>
                    <el-col :span="2">
                        <el-form-item>
                            <el-button type="primary" @click="submit">保存</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-tab-pane>

            <el-tab-pane label="第4页">
                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="成交价" prop="cjj">
                            <el-input v-model="ruleForm.cjj"></el-input>
                        </el-form-item>
                    </el-col>
                    <!-- <el-col :span="12">
                        <el-form-item label="佣金" prop="yj">
                            <el-input v-model="ruleForm.yj"></el-input>
                        </el-form-item>
                    </el-col> -->
                </el-row>
            
                <!-- <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="证件类型" prop="zjlx">
                            <el-input v-model="ruleForm.zjlx"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="证件号码" prop="zjhm">
                            <el-input v-model="ruleForm.zjhm"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <!-- <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="竟买人姓名" prop="jmrxm">
                            <el-input v-model="ruleForm.jmrxm"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="竟买人号牌" prop="jmrhp">
                            <el-input v-model="ruleForm.jmrhp"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <!-- <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="拍卖公告" prop="pmgg">
                            <el-input v-model="ruleForm.pmgg"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="竞买须知" prop="jmxz">
                            <el-input v-model="ruleForm.jmxz"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="围观数" prop="wgs">
                            <el-input v-model="ruleForm.wgs"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="顺序" prop="sx">
                            <el-input v-model="ruleForm.sx"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row :gutter="24">
                    <el-col :span="10">
                        <el-form-item label="数量" prop="number">
                            <el-input v-model="ruleForm.number"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="其他" prop="other">
                            <el-input v-model="ruleForm.other"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <!-- <el-row :gutter="24">
                    <el-col :span="22">
                        <el-form-item label="成交备注" prop="cjbz">
                            <el-input type="textarea" v-model="ruleForm.cjbz"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <el-row :gutter="24">
                    <el-col :span="18">
                        &nbsp;
                    </el-col>
                    <el-col :span="2">
                        <el-form-item>
                            <el-button type="primary" @click="submitFinal">提交</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
                
            </el-tab-pane>
        </el-tabs>

  
    </el-form>

  
    <!-- <span style="display: flex; margin-right: 1%;">
        <div style="flex: 1"></div>
        <el-button @click="dialogClose">取 消</el-button>
        <el-button type="primary" @click="submitData()">确 定</el-button>
    </span> -->
  
    <el-row>
        <br>
    </el-row>
  
  </el-dialog>
  
  </template>
  
  <script>
  
    import QuillEditor from '../../../components/pages/quillEditor.vue';
    import { addData,getAllArea,getWthtbh,getPmhbh,getPmhOptions,getTree } from '@/api/auctionManage/objectManage';
    export default {
        components:{
            QuillEditor
        },
      data(){
          return{
            true1: true,
            restaurants: [],
            state1: '',
              imageUrl: '',
              actionLogo: '/api/lots/addLotFile',
              actionVideo: '/api/lots/addLotFile',
              actionFile: '/api/lots/addLotFile',
              pmhbhOptions: [],

              options: [],
              areas:[],
              ssfl: [],
              days: [
                {label: '0天', value: '0'},
                {label: '1天', value: '1'},
                {label: '2天', value: '2'},
                {label: '3天', value: '3'},
                {label: '4天', value: '4'},
                {label: '5天', value: '5'},
                {label: '6天', value: '6'},
                {label: '7天', value: '7'},
                {label: '8天', value: '8'},
                {label: '9天', value: '9'},
                {label: '10天', value: '10'},
                {label: '11天', value: '11'},
                {label: '12天', value: '12'},
                {label: '13天', value: '13'},
                {label: '14天', value: '14'},
                {label: '15天', value: '15'},
                {label: '16天', value: '16'},
                {label: '17天', value: '17'},
                {label: '18天', value: '18'},
                {label: '19天', value: '19'},
                {label: '20天', value: '20'},
                {label: '21天', value: '21'},
                {label: '22天', value: '22'},
                {label: '23天', value: '23'},
                {label: '24天', value: '24'},
                {label: '25天', value: '25'},
                {label: '26天', value: '26'},
                {label: '27天', value: '27'},
                {label: '28天', value: '28'},
                {label: '29天', value: '29'},
                {label: '30天', value: '30'}
              ],
              hours: [
                {label: '0时', value: '0'},
                {label: '1时', value: '1'},
                {label: '2时', value: '2'},
                {label: '3时', value: '3'},
                {label: '4时', value: '4'},
                {label: '5时', value: '5'},
                {label: '6时', value: '6'},
                {label: '7时', value: '7'},
                {label: '8时', value: '8'},
                {label: '9时', value: '9'},
                {label: '10时', value: '10'},
                {label: '11时', value: '11'},
                {label: '12时', value: '12'},
                {label: '13时', value: '13'},
                {label: '14时', value: '14'},
                {label: '15时', value: '15'},
                {label: '16时', value: '16'},
                {label: '17时', value: '17'},
                {label: '18时', value: '18'},
                {label: '19时', value: '19'},
                {label: '20时', value: '20'},
                {label: '21时', value: '21'},
                {label: '22时', value: '22'},
                {label: '23时', value: '23'},
              ],
              minutes: [
                {'label': '0分', 'value': '0'},
                {'label': '1分', 'value': '1'},
                {'label': '2分', 'value': '2'},
                {'label': '3分', 'value': '3'},
                {'label': '4分', 'value': '4'},
                {'label': '5分', 'value': '5'},
                {'label': '6分', 'value': '6'},
                {'label': '7分', 'value': '7'},
                {'label': '8分', 'value': '8'},
                {'label': '9分', 'value': '9'},
                {'label': '10分', 'value': '10'},
                {'label': '11分', 'value': '11'},
                {'label': '12分', 'value': '12'},
                {'label': '13分', 'value': '13'},
                {'label': '14分', 'value': '14'},
                {'label': '15分', 'value': '15'},
                {'label': '16分', 'value': '16'},
                {'label': '17分', 'value': '17'},
                {'label': '18分', 'value': '18'},
                {'label': '19分', 'value': '19'},
                {'label': '20分', 'value': '20'},
                {'label': '21分', 'value': '21'},
                {'label': '22分', 'value': '22'},
                {'label': '23分', 'value': '23'},
                {'label': '24分', 'value': '24'},
                {'label': '25分', 'value': '25'},
                {'label': '26分', 'value': '26'},
                {'label': '27分', 'value': '27'},
                {'label': '28分', 'value': '28'},
                {'label': '29分', 'value': '29'},
                {'label': '30分', 'value': '30'},
                {'label': '31分', 'value': '31'},
                {'label': '32分', 'value': '32'},
                {'label': '33分', 'value': '33'},
                {'label': '34分', 'value': '34'},
                {'label': '35分', 'value': '35'},
                {'label': '36分', 'value': '36'},
                {'label': '37分', 'value': '37'},
                {'label': '38分', 'value': '38'},
                {'label': '39分', 'value': '39'},
                {'label': '40分', 'value': '40'},
                {'label': '41分', 'value': '41'},
                {'label': '42分', 'value': '42'},
                {'label': '43分', 'value': '43'},
                {'label': '44分', 'value': '44'},
                {'label': '45分', 'value': '45'},
                {'label': '46分', 'value': '46'},
                {'label': '47分', 'value': '47'},
                {'label': '48分', 'value': '48'},
                {'label': '49分', 'value': '49'},
                {'label': '50分', 'value': '50'},
                {'label': '51分', 'value': '51'},
                {'label': '52分', 'value': '52'},
                {'label': '53分', 'value': '53'},
                {'label': '54分', 'value': '54'},
                {'label': '55分', 'value': '55'},
                {'label': '56分', 'value': '56'},
                {'label': '57分', 'value': '57'},
                {'label': '58分', 'value': '58'},
                {'label': '59分', 'value': '59'},
              ],
              seconds: [
                {label: '0秒', value: '0'},
                {label: '1秒', value: '1'},
                {label: '2秒', value: '2'},
                {label: '3秒', value: '3'},
                {label: '4秒', value: '4'},
                {label: '5秒', value: '5'},
                {label: '6秒', value: '6'},
                {label: '7秒', value: '7'},
                {label: '8秒', value: '8'},
                {label: '9秒', value: '9'},
                {label: '10秒', value: '10'},
                {label: '11秒', value: '11'},
                {label: '12秒', value: '12'},
                {label: '13秒', value: '13'},
                {label: '14秒', value: '14'},
                {label: '15秒', value: '15'},
                {label: '16秒', value: '16'},
                {label: '17秒', value: '17'},
                {label: '18秒', value: '18'},
                {label: '19秒', value: '19'},
                {label: '20秒', value: '20'},
                {label: '21秒', value: '21'},
                {label: '22秒', value: '22'},
                {label: '23秒', value: '23'},
                {label: '24秒', value: '24'},
                {label: '25秒', value: '25'},
                {label: '26秒', value: '26'},
                {label: '27秒', value: '27'},
                {label: '28秒', value: '28'},
                {label: '29秒', value: '29'},
                {label: '30秒', value: '30'},
                {label: '31秒', value: '31'},
                {label: '32秒', value: '32'},
                {label: '33秒', value: '33'},
                {label: '34秒', value: '34'},
                {label: '35秒', value: '35'},
                {label: '36秒', value: '36'},
                {label: '37秒', value: '37'},
                {label: '38秒', value: '38'},
                {label: '39秒', value: '39'},
                {label: '40秒', value: '40'},
                {label: '41秒', value: '41'},
                {label: '42秒', value: '42'},
                {label: '43秒', value: '43'},
                {label: '44秒', value: '44'},
                {label: '45秒', value: '45'},
                {label: '46秒', value: '46'},
                {label: '47秒', value: '47'},
                {label: '48秒', value: '48'},
                {label: '49秒', value: '49'},
                {label: '50秒', value: '50'},
                {label: '51秒', value: '51'},
                {label: '52秒', value: '52'},
                {label: '53秒', value: '53'},
                {label: '54秒', value: '54'},
                {label: '55秒', value: '55'},
                {label: '56秒', value: '56'},
                {label: '57秒', value: '57'},
                {label: '58秒', value: '58'},
                {label: '59秒', value: '59'},
              ],
              timeForm:{
                freeDay: '',
                freeHour: '',
                freeMinute: '',
                freeSecond: '',
                limitedHour: '',
                limitedMinute: '',
                limitedSecond: '',
                delayedHour: '',
                delayedMinute: '',
                delayedSecond: ''
              },
              ruleForm: {
                // bdbh: "",//标的编号
                bdmc: "",//标的名称
                bdlx: "",//标的类型
                wtflx: "",//委托方类型
                pmxs: '',//拍卖形式
                qpj: '',//起拍价
                cjj: '',//成交价
                pgj: '',//评估价
                bzj: '',//保证金
                // blj: '',//保留价
                bmxz: '',//报名限制
                pmhbh: "",//拍卖会编号
                pmhmc: '',//拍卖会名称
                pmhlx: '',//拍卖会类型
                fbzt: '',//发布状态
                pmzt: '',//拍卖状态
                hpzt: '',//悔拍状态
                czsj: '',//操作时间
                jnfs: '',//缴纳方式
                szd: '',//所在地
                xxdz: '',//详细地址
                zxr: '',//咨询人
                zxlxfs: '',//咨询联系方式
                ssfl: '',//所属分类
                ejfl: '',//二级分类
                // vrljdz: '',//vr链接地址
                pmfs: '',//拍卖方式
                jjfd: '',//加价幅度
                zyjjsj: '',//自由竞价时间
                xsjjsj: '',//限时竞价时间
                ysjjsj: '',//延时竞价时间
                sfxg: '',//是否限购
                sfdk: '',//是否支持贷款
                sfsqyj: '',//是否收取佣金
                sqyjfs: '',//收取佣金方式
                gdbl: '',//固定比例
                yjsx: '',//佣金上限
                qjblxx: '',//区间比例下限
                qjblsx: '',//区间比例上限
                gdje: '',//固定金额
                bdjs: '',//标的介绍
                bdjst: '',//标的介绍图
                zyts: '',//重要提示
                bz: '',//备注
                sctp: '',//上传图片
                scsp: '',//上传视频
                scfj: '',//上传附件
                yj: '',//佣金
                // zjhm: '',//证件号码
                // zjlx: '',//证件类型
                // jmrxm: '',//竞买人姓名
                // jmrhp: '',//竞买人号牌
                cjbz: '',//成交备注
                pmgg: '',//拍卖公告
                jmxz: '',//竞买须知
                wgs: '',//围观数
                sx: '',//顺序
                deleteflag: false,
                // number: '',
                other: "",
                // wthtbh: "",
                sfblj: '',//是否公布保留价
                cpzt: false,//撤拍状态
                },
              rules:
                {
                    bdmc:[
                        {required: true, message: '请选择'}
                    ],
                    wtflx:[
                        {required: true, message: '请选择'}
                    ],
                    pmxs:[
                        {required: true, message: '请选择'}
                    ],
                    qpj:[
                        {required: true, message: '请输入'}
                    ],
                    cjj:[
                        {required: true, message: '请输入'}
                    ],
                    pgj:[
                        {required: true, message: '请输入'}
                    ],
                    bzj:[
                        {required: true, message: '请输入'}
                    ],
                    bmxz:[
                        {required: true, message: '请选择'}
                    ],
                    pmhbh:[
                        {required: true, message: '请选择'}
                    ],
                    pmhmc:[
                        {required: true, message: '请选择'}
                    ],
                    // pmhlx:[
                    //     {required: true, message: '请选择'}
                    // ],
                    fbzt:[
                        {required: true, message: '请选择'}
                    ],
                    pmzt:[
                        {required: true, message: '请选择'}
                    ],
                    hpzt:[
                        {required: true, message: '请选择'}
                    ],
                    czsj:[
                        {required: true, message: '请选择'}
                    ],
                    jnfs:[
                        {required: true, message: '请选择'}
                    ],
                    szd:[
                        {required: true, message: '请选择'}
                    ],
                    xxdz:[
                        {required: true, message: '请输入'}
                    ],
                    zxr:[
                        {required: true, message: '请输入'}
                    ],
                    zxlxfs:[
                        {required: true, message: '请输入'}
                    ],
                    ssfl:[
                        {required: true, message: '请选择'}
                    ],
                    eifl:[
                        {required: true, message: '请选择'}
                    ],
                    pmfs:[
                        {required: true, message: '请选择'}
                    ],
                    jjfd:[
                        {required: true, message: '请输入'}
                    ],
                    // zyjjsj:[
                    //     {required: true, message: '请选择'}
                    // ],
                    // xsjjsj:[
                    //     {required: true, message: '请选择'}
                    // ],
                    // ysjjsj:[
                    //     {required: true, message: '请选择'}
                    // ],
                    sfxg:[
                        {required: true, message: '请选择'}
                    ],
                    sfsqyj:[
                        {required: true, message: '请选择'}
                    ],
                    sqyjfs:[
                        {required: true, message: '请选择'}
                    ],
                    sctp:[
                        {required: true, message: '请选择'}
                    ],
                    yj:[
                        {required: true, message: '请输入'}
                    ],
                    // zjhm:[
                    //     {required: true, message: '请输入'}
                    // ],
                    // zjlx:[
                    //     {required: true, message: '请选择'}
                    // ],
                    // jmrxm:[
                    //     {required: true, message: '请输入'}
                    // ],
                    // jmrhp:[
                    //     {required: true, message: '请输入'}
                    // ],
                    cjbz:[
                        {required: true, message: '请输入'}
                    ],
                    wgs:[
                        {required: true, message: '请输入'}
                    ],
                    sx:[
                        {required: true, message: '请输入'}
                    ],
                    number:[
                        {required: true, message: '请输入'}
                    ],
                    // wthtbh:[
                    //     {required: true, message: '请选择'}
                    // ],
                    sfblj:[
                        {required: true, message: '请选择'}
                    ],
                }
          }
      },
      props:{
        isShowAddDialog:{
              type:Boolean
          },
      },
      methods: {
          dialogClose(){ 
            this.$emit('dialogClose');
          },
          formatTime(time){
            var dateee = new Date(time).toJSON();
            return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
          },
          quillChange1(data){
            this.ruleForm.bdjs = data;
        },
          formatSeconds(value) {
            let secondTime = parseInt(value);
            let minuteTime = 0;
            let hourTime = 0;
            if (secondTime >= 60) {
                minuteTime = parseInt(secondTime / 60);
                secondTime = parseInt(secondTime % 60);
                if (minuteTime >= 60) {
                hourTime = parseInt(minuteTime / 60);
                minuteTime = parseInt(minuteTime % 60);
                }
            }
            // 补0
            hourTime = hourTime < 10 ? "0" + hourTime : hourTime;
            minuteTime = minuteTime < 10 ? "0" + minuteTime : minuteTime;
            secondTime = secondTime < 10 ? "0" + secondTime : secondTime;
            let res = hourTime + ":" + minuteTime + ":" + secondTime;
            return res;
          },
          submitData(){
            this.$refs.addForm.validate((valid) => {
                if (!valid) {
                    return ;
                }
                else {
                    // console.log(this.ruleForm);
                    // this.ruleForm.czsj = this.formatTime(this.ruleForm.czsj);
                    let szd = '';
                    for(let item in this.ruleForm.szd){
                        if(item == this.ruleForm.szd.length-1){
                            szd += this.ruleForm.szd[item];
                        }
                        else{
                            szd += this.ruleForm.szd[item] + ',';
                        }
                    }
                    let ssfl = '';
                    for(let item in this.ruleForm.ssfl){
                        if(item == this.ruleForm.ssfl.length-1){
                            ssfl += this.ruleForm.ssfl[item];
                        }
                        else{
                            ssfl += this.ruleForm.ssfl[item] + ',';
                        }
                    }

                    this.ruleForm.szd = szd;
                    this.ruleForm.ssfl = ssfl;
                    this.ruleForm.qpj = parseInt(this.ruleForm.qpj);
                    this.ruleForm.cjj = parseInt(this.ruleForm.cjj);
                    this.ruleForm.pgj = parseInt(this.ruleForm.pgj);
                    this.ruleForm.bzj = parseInt(this.ruleForm.bzj);
                    this.ruleForm.jjfd = parseInt(this.ruleForm.jjfd);
                    this.ruleForm.gdbl = parseFloat(this.ruleForm.gdbl);
                    this.ruleForm.qjblxx = parseFloat(this.ruleForm.qjblxx);
                    this.ruleForm.qjblsx = parseFloat(this.ruleForm.qjblsx);
                    this.ruleForm.gdje = parseInt(this.ruleForm.gdje);
                    this.ruleForm.yj = parseInt(this.ruleForm.yj);
                    this.ruleForm.wgs = parseInt(this.ruleForm.wgs);
                    this.ruleForm.sx = parseInt(this.ruleForm.sx);
                    this.ruleForm.fbzt = '待提交';
                    this.ruleForm.pmzt = '未开拍';
                    this.ruleForm.hpzt = '未悔拍';
                    let xsjjsj = parseInt(this.timeForm.limitedHour)*60*60 + parseInt(this.timeForm.limitedMinute)*60 + parseInt(this.timeForm.limitedSecond);
                    this.ruleForm.xsjjsj = this.formatSeconds(xsjjsj);
                    let ysjjsj = parseInt(this.timeForm.delayedHour)*60*60 + parseInt(this.timeForm.delayedMinute)*60 + parseInt(this.timeForm.delayedSecond);
                    this.ruleForm.ysjjsj = this.formatSeconds(ysjjsj);
                    // this.ruleForm.zyjjsj = '' + this.timeForm.freeDay + ',' + this.timeForm.freeHour + ',' + this.timeForm.freeMinute + ',' + this.timeForm.freeSecond;
                    // this.ruleForm.xsjjsj = '' + this.timeForm.limitedHour + ',' + this.timeForm.limitedMinute + ',' + this.timeForm.limitedSecond;
                    // this.ruleForm.ysjjsj = '' + this.timeForm.delayedHour + ',' + this.timeForm.delayedMinute + ',' + this.timeForm.delayedSecond;

                    console.log(this.ruleForm);
                    addData(this.ruleForm).then((res) => {
                        if(res){
                            console.log(res.msg);
                            this.dialogClose();
                        }
                    })
                }
            });
          },
          radioType(){
              console.log(this.ruleForm.sqyjfs);
          },
          logohandleAvatarSuccess (file) {
            console.log(file);
            this.ruleForm.sctp = file.data;
            },
          beforeAvatarUpload(file) {
              const isJPG = file.type === 'image/jpeg/jpg/git/bmp/png';
  
              if (!isJPG) {
                  this.$message.error('上传头像图片只能是jpeg/jpg/git/bmp/png格式!');
              }
              return isJPG;
          },
          handleClose(done) {
              done();
          },
          handleChange(value) {
            console.log(value);
            this.ruleForm.bdlx = value[1];
          },
          handleChange2(value) {
            console.log(value);
            this.ruleForm.szd = value;
          },
          handleVideo (file) {
            console.log(file);
            this.ruleForm.scsp = file.data;
          },
          handleRemoveVideo (file) {
            console.log(file);
            this.ruleForm.scsp = null;
          },
          handleFile (file) {
            console.log(file);
            this.ruleForm.scfj = file.data;
          },
          handleRemoveFile (file) {
            console.log(file);
            this.ruleForm.scfj = null;
          },
          matterTree(data) {
            for (var i = 0; i < data.length; i++) {
                // 这里面就是你处理数据的地方 
                data[i].label = data[i].name;
                data[i].value = data[i].name;
                if (data[i].children) {
                // children若不为空数组，则继续 递归调用 本方法
                    this.matterTree(data[i].children)
                }
            }
            return data;
          },
          submit(e){
            // let xsjjsj = parseInt(this.timeForm.limitedHour)*60*60 + parseInt(this.timeForm.limitedMinute)*60 + parseInt(this.timeForm.limitedSecond);
            // console.log(xsjjsj);
            // console.log(this.formatSeconds(xsjjsj));
            // console.log(typeof(this.formatSeconds(xsjjsj)));
            this.$refs.addForm.validate((valid) => {
                if (valid) {
                    // console.log(e);
                    // console.log('合并前',this.ruleForm);
                    this.ruleForm = Object.assign(this.ruleForm, e);
                    // console.log('合并后',this.ruleForm);
                    // this.$message.success('保存成功');
                }
                else{
                    // this.$message.warning('注意必填项');
                    return ;
                }
            });
        },
        submitFinal(e){
            this.$refs.addForm.validate((valid) => {
                if (valid) {
                    // console.log(e);
                    // console.log('合并前',this.ruleForm);
                    this.ruleForm = Object.assign(this.ruleForm, e);
                    // console.log('合并后',this.ruleForm);
                    // this.$message.success('保存成功');
                    this.submitData();
                }
                else{
                    // this.$message.warning('注意必填项');
                    return ;
                }
            });
        },
          getArea(){
            getAllArea().then((res) => {
                if(res){
                    console.log(res);
                    this.options = this.matterTree(res.data);
                    // console.log(this.options);
                }
            })
          },
          getAllWthtbh(){
            getWthtbh().then((res) => {
                if(res){
                    console.log(res);
                    this.areas = res.data;
                    for(let item in this.areas){
                        this.areas[item].value = this.areas[item].wthtbh;
                        this.areas[item].label = this.areas[item].wthtbh;
                    }
                }
            })
          },
          getAllPmhbh(){
            getPmhbh().then((res) => {
                if(res){
                    // for(let item of res.data){
                    //     if(!this.pmhbhOptions.includes(item.pmhbh)){
                    //         this.pmhbhOptions.push(item.pmhbh);
                    //     }
                    // }
                    this.pmhbhOptions = res.data;
                    for(let item in this.pmhbhOptions){
                        this.pmhbhOptions[item].value = this.pmhbhOptions[item].pmhbh;
                        this.pmhbhOptions[item].label = this.pmhbhOptions[item].pmhbh;
                    }
                }
            })
          },
          getPmhData(){
            getPmhOptions(this.ruleForm.pmhbh).then((res) => {
                if(res){
                    // console.log('pmhData',res.data);
                    this.ruleForm.pmxs = res.data[0].pmfs;
                    this.ruleForm.pmhmc = res.data[0].pmhmc;
                }
            })
          },
          getClassification(){
            getTree().then((res) => {
                if(res){
                    console.log(res.data);
                    this.ssfl = this.matterTree(res.data);
                    console.log(this.ssfl);
                }
            })
          },
      },
      mounted(){
        this.getArea();
        // this.getAllWthtbh();
        this.getAllPmhbh();
        this.getClassification();
      }
  }
  </script>
  
  <style lang="less">
  .editor{
        height: 200px; 
        margin-bottom: 100px;
    }
  .el-radio__label{
      padding-left: 6px !important;
  }
  .el-row{
      margin-left: 0 !important;
      margin-right: 0 !important;
  }
  .select{
      width: 100%;
  }
  .avatar-uploader .el-upload {
      border: 1px dashed #d9d9d9;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
      border-color: #409EFF;
  }
  .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      line-height: 178px;
      text-align: center;
  }
  .avatar {
      width: 178px;
      height: 178px;
      display: block;
  }
  .el-dialog__close, .el-message-box__close{
      color: #606266 !important;
  }

  .style2{
      margin-left: -11%;
  }

  .style4{
      margin-left: -2%; 
      line-height: 36px; 
      color: #606266; 
      font-size: 14px;
  }
  .style5{
      line-height: 36px; 
      color: #606266; 
      font-size: 14px; 
      margin-left: 4%;
  }
  .style6{
      margin-left: -10%;
  }
  .el-drawer__header {
    background-color: #459f75;
    align-items: center;
    color: #fff;
    height: 60px;
    margin-bottom: 15px;
    font-weight: bold;
  }
  .el-scrollbar__wrap {
   overflow: hidden !important;
  }
  .ql-toolbar.ql-snow+.ql-container.ql-snow {
    height: 200px;
  }
</style>
  